import React from 'react';
import Header from './Common/header';

export default class Content_picture extends React.Component {
    render() {
        const { data = {}, eid } = this.props;

        const { moreLocal, iconMore } = data;
        return (
            <div className="item" id={`item_${eid}`}>
                <Header ecId={`${this && this.props && this.props.ecId || ''}_Header@y60p1u`} data={data} eid={eid} />
                <div className="content" id={`content_${eid}`}>
                    <div className="content_view" id={`content_view_id_${eid}`}>
                        <div className="content_view" style={{ overflow: 'hidden' }}>
                            <div style={{ width: '92%', margin: '0px auto' }}>
                                <div style={{ width: '100%', position: 'relative' }}>
                                    <div style={{ width: '35px', paddingTop: '22px', position: 'absolute', left: '-27px', overflow: 'hidden' }}>
                                        <img src="/page/element/Picture/resource/image/prev-horizontal_wev8.png" alt="" />
                                    </div>
                                    <div style={{ width: '100%', display: '-webkit-inline-box' }}>
                                        <div style={{ width: '24.5%', height: '75px', paddingLeft: '2%' }}>
                                            <img src="/page/resource/userfile/image/elementPrew/picture/Hindustry1.png" alt="" style={{ width: '100%', height: '75px', margin: '0px auto' }} />
                                        </div>
                                        <div style={{ width: '24.5%', height: '75px', paddingLeft: '2%' }}>
                                            <img src="/page/resource/userfile/image/elementPrew/picture/Hindustry2.png" alt="" style={{ width: '100%', height: '75px', margin: '0px auto' }} />
                                        </div>
                                        <div style={{ width: '24.5%', height: '75px', paddingLeft: '2%' }}>
                                            <img src="/page/resource/userfile/image/elementPrew/picture/Hindustry3.png" alt="" style={{ width: '100%', height: '75px', margin: '0px auto' }} />
                                        </div>
                                        <div style={{ width: '24.5%', height: '75px', paddingLeft: '2%' }}>
                                            <img src="/page/resource/userfile/image/elementPrew/picture/Hindustry4.png" alt="" style={{ width: '100%', height: '75px', margin: '0px auto' }} />
                                        </div>
                                    </div>
                                    <div style={{ width: '35px', paddingTop: '28px', position: 'absolute', right: '-27px', top: '-5px', overflow: 'hidden' }}>
                                        <img src="/page/element/Picture/resource/image/next-horizontal_wev8.png" alt="" />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div className="footer" id={`footer_${eid}`} style={{ textAlign: 'right' }}>
                    {moreLocal == 'footer' ? <a href="javascript:;"><img src={iconMore} alt="" /></a> : ''}
                </div>
            </div>
        );
    }
}

